<template>
  <component :is="`${icon}Icon`" v-if="isHeroIcon" aria-hidden="true" />
</template>

<script>
import {
  CheckCircleIcon as CheckCircleSolidIcon,
  MagnifyingGlassIcon as SearchSolidIcon,
  XCircleIcon as XCircleSolidIcon,
} from '@heroicons/vue/20/solid'
import {
  AdjustmentsVerticalIcon,
  ArrowDownLeftIcon,
  ArrowDownTrayIcon as DownloadIcon,
  ArrowLeftIcon,
  ArrowPathIcon as RefreshIcon,
  ArrowRightIcon,
  ArrowsPointingOutIcon,
  ArrowTopRightOnSquareIcon as ExternalLinkIcon,
  ArrowUturnLeftIcon as ReplyIcon,
  AtSymbolIcon,
  BanknotesIcon,
  Bars3BottomLeftIcon,
  Bars3BottomRightIcon as MenuAlt3Icon,
  Bars3CenterLeftIcon,
  Bars3Icon,
  BarsArrowUpIcon as SortAscendingIcon,
  BellIcon,
  BookmarkIcon,
  BookOpenIcon,
  BriefcaseIcon,
  BuildingOfficeIcon as OfficeBuildingIcon,
  CalendarIcon,
  CameraIcon,
  ChartBarSquareIcon as ChartSquareBarIcon,
  ChatBubbleBottomCenterTextIcon,
  ChatBubbleLeftEllipsisIcon as ChatAltIcon,
  ChatBubbleOvalLeftEllipsisIcon as ChatIcon,
  CheckBadgeIcon,
  CheckCircleIcon,
  CheckIcon,
  ChevronDownIcon,
  ChevronLeftIcon,
  ChevronRightIcon,
  ChevronUpDownIcon as SelectorIcon,
  ChevronUpIcon,
  ClipboardIcon,
  ClockIcon,
  CloudArrowUpIcon,
  CodeBracketIcon,
  Cog6ToothIcon as CogIcon,
  CreditCardIcon,
  CurrencyDollarIcon,
  CursorArrowRaysIcon as CursorClickIcon,
  DevicePhoneMobileIcon as DeviceMobileIcon,
  DocumentArrowDownIcon as DocumentDownloadIcon,
  DocumentDuplicateIcon as DuplicateIcon,
  DocumentIcon,
  DocumentPlusIcon as DocumentAddIcon,
  DocumentTextIcon,
  EllipsisHorizontalIcon as DotsHorizontalIcon,
  EllipsisVerticalIcon as DotsVerticalIcon,
  EnvelopeIcon as MailIcon,
  ExclamationTriangleIcon,
  EyeIcon,
  FaceFrownIcon as EmojiSadIcon,
  FaceSmileIcon as EmojiHappyIcon,
  FolderIcon,
  FunnelIcon as FilterIcon,
  GlobeAsiaAustraliaIcon as GlobeIcon,
  HomeIcon,
  InformationCircleIcon,
  LightBulbIcon,
  LinkIcon,
  ListBulletIcon,
  MegaphoneIcon as SpeakerphoneIcon,
  MicrophoneIcon,
  MinusIcon,
  MoonIcon,
  PaperClipIcon,
  PencilIcon,
  PencilSquareIcon as PencilAltIcon,
  PhoneIcon,
  PhoneXMarkIcon,
  PhotoIcon as PhotographIcon,
  PlusIcon,
  QuestionMarkCircleIcon,
  RectangleStackIcon as CollectionIcon,
  RocketLaunchIcon,
  ScaleIcon,
  ShareIcon,
  ShieldCheckIcon,
  ShieldExclamationIcon,
  SparklesIcon,
  SpeakerWaveIcon as VolumeUpIcon,
  SpeakerXMarkIcon as VolumeOffIcon,
  Squares2X2Icon as ViewGridIcon,
  SquaresPlusIcon,
  StarIcon,
  SunIcon,
  SwatchIcon as ColorSwatchIcon,
  TagIcon,
  TrashIcon,
  TruckIcon,
  UserGroupIcon,
  UserIcon,
  UsersIcon,
  ViewColumnsIcon,
  ViewfinderCircleIcon,
  WindowIcon,
  WrenchScrewdriverIcon,
  XCircleIcon,
  XMarkIcon as XIcon,
} from '@heroicons/vue/24/outline'

export default {
  components: {
    EyeIcon,
    SparklesIcon,
    CheckBadgeIcon,
    BanknotesIcon,
    ClockIcon,
    CodeBracketIcon,
    RocketLaunchIcon,
    ChatBubbleBottomCenterTextIcon,
    ViewfinderCircleIcon,
    SunIcon,
    MoonIcon,
    SpeakerphoneIcon,
    VolumeOffIcon,
    VolumeUpIcon,
    EmojiHappyIcon,
    EmojiSadIcon,
    ArrowRightIcon,
    ArrowLeftIcon,
    ReplyIcon,
    CurrencyDollarIcon,
    CursorClickIcon,
    FilterIcon,
    ShareIcon,
    ListBulletIcon,
    CogIcon,
    CollectionIcon,
    ColorSwatchIcon,
    HomeIcon,
    LightBulbIcon,
    Bars3CenterLeftIcon,
    Bars3BottomLeftIcon,
    MenuAlt3Icon,
    PhotographIcon,
    PlusIcon,
    MinusIcon,
    MicrophoneIcon,
    UserGroupIcon,
    ViewGridIcon,
    XIcon,
    SearchSolidIcon,
    ChartSquareBarIcon,
    MailIcon,
    CalendarIcon,
    UsersIcon,
    UserIcon,
    OfficeBuildingIcon,
    FolderIcon,
    CheckCircleIcon,
    CheckCircleSolidIcon,
    CheckIcon,
    XCircleIcon,
    XCircleSolidIcon,
    InformationCircleIcon,
    ChevronUpIcon,
    ChevronDownIcon,
    ChevronLeftIcon,
    ChevronRightIcon,
    ExclamationTriangleIcon,
    ShieldExclamationIcon,
    ShieldCheckIcon,
    SquaresPlusIcon,
    QuestionMarkCircleIcon,
    SelectorIcon,
    BellIcon,
    ArrowsPointingOutIcon,
    RefreshIcon,
    DuplicateIcon,
    GlobeIcon,
    DeviceMobileIcon,
    PhoneIcon,
    PhoneXMarkIcon,
    AdjustmentsVerticalIcon,
    WindowIcon,
    DotsVerticalIcon,
    DotsHorizontalIcon,
    DocumentDownloadIcon,
    DocumentAddIcon,
    DocumentIcon,
    DocumentTextIcon,
    ArrowDownLeftIcon,
    DownloadIcon,
    ExternalLinkIcon,
    LinkIcon,
    TrashIcon,
    PencilAltIcon,
    PencilIcon,
    StarIcon,
    Bars3Icon,
    TagIcon,
    ViewColumnsIcon,
    SortAscendingIcon,
    AtSymbolIcon,
    BriefcaseIcon,
    ChatIcon,
    ChatAltIcon,
    BookOpenIcon,
    BookmarkIcon,
    CameraIcon,
    TruckIcon,
    CloudArrowUpIcon,
    PaperClipIcon,
    ClipboardIcon,
    CreditCardIcon,
    WrenchScrewdriverIcon,
    ScaleIcon,
  },

  props: {
    type: {
      type: String,
      default: 'hero',
    },

    icon: {
      required: true,
    },
  },

  setup(props) {
    function isHeroIcon() {
      return props.type === 'hero'
    }

    return {
      isHeroIcon,
    }
  },
}
</script>
